<template>
  <Form ref="form" :model="data" :rules="rules" label-position="top" class="ivu-mt">
    <Row type="flex" :gutter="48">
      <Col >
        <FormItem label="原手机号" prop="oldPhone">
          <Input v-model="data.oldPhone" placeholder="请输入原手机号" />
        </FormItem>
        <FormItem label="新手机号" prop="newPhone">
          <Input v-model="data.newPhone" placeholder="请输入新手机号" />
        </FormItem>
        <FormItem label="确认新手机号" prop="surePhone">
          <Input v-model="data.surePhone" placeholder="请再次输入新手机号" />
        </FormItem>
        <FormItem>
          <Button  @click="handleSubmit">修改手机号</Button>
        </FormItem>
      </Col>
    </Row>
  </Form>
</template>

<script>
import {validatorPassword} from '@/libs/validator';
import {accountResetPhone} from '@/api/systemSet';
import Setting from '@/setting';

export default {
  name: "setPhone",
  props:{
        info:{
          type:Object,
          default:()=>{
            return {}
          }
        }
      },
  data(){
    return {
      data: {
        oldPhone: '',
        newPhone: '',
        surePhone: '',
      },
      rules: {

        oldPhone: [
          { required: true, message: '请输入原手机号', trigger: 'blur' }
        ],
        newPhone: [
          { required: true, message: '请输入新手机号', trigger: 'blur' }
        ],
        surePhone: [
          { required: true, message: '请再次输入新手机号', trigger: 'blur' }
        ]
      }
    }
  },
  methods:{
    handleSubmit(){
      this.$refs.form.validate(async (valid) => {
        if (valid) {
          if(this.data.newPhone!=this.data.surePhone){
            this.$Message.warning('两次输入的手机号必须保持一致')
            return
          }
          let res =await this.update();
          if(res.code==0){
            this.$Message.success('手机号更新成功!');
            this.$emit('success',true)
            this.info.phone = this.data.newPhone;
            this.data.oldPhone = '';
            this.data.newPhone = '';
            this.data.surePhone = '';
            this.$store.commit('admin/user/setPhone',this.data.newPhone);
          }else{
            this.$Message.error(_.get(res,'message')||'手机号修改失败！')
          }

        }
      });
    },
   async update(){
      let {newPhone,oldPhone}= this.data
      return await accountResetPhone({newPhone,oldPhone});
   },
  },
}
</script>

<style scoped>

</style>